<template>
  <device-common :trend-show="true" />
</template>

<script>
import DeviceCommon from '@/components/Device/common'
import { mapGetters } from 'vuex'
import { dclassCodeMap } from '@/utils/constant'
export default {
  components: {
    DeviceCommon
  },
  computed: {
    ...mapGetters(['currentDevice'])
  },
  watch: {
    currentDevice: {
      handler(newVal, oldVal) {
        if (+newVal.product_type === dclassCodeMap.ndvi) {
          newVal.states.NDVI = this.getNDVI(newVal.states)
        }
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    getNDVI(states) {
      try {
        const UpNir = states.UpNir
        const DownNir = states.DownNir
        const UpRed = states.UpRed
        const DownRed = states.DownRed
        const a = DownNir / UpNir
        const b = DownRed / UpRed
        return (a - b) / (a + b)
      } catch (err) {
        console.log(err)
        return 0
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
